 var area =1;
 var page = 1;

 window.onload=function(){
     $.ajax({
         "url":"/IndexSongsServlet",
         "data":"area="+area+"&page="+page,
         "type":"GET",
         "dataType":"json",
         "success":function (data) {
             $.each(data,function (index,singer) {
                 $('.song_item[data-index='+(index+1)+'] img').attr('src',singer.song.poster);
                 $('.song_item[data-index='+(index+1)+'] .song_name').html(singer.song.songName);
                 $('.song_item[data-index='+(index+1)+'] .singer_name'). html(singer.singerName);
                 $('.song_item[data-index='+(index+1)+'] .text-ellipsis:last-child').html(singer.song.time);
                 $('.song_item[data-index='+(index+1)+'] .singer_id').attr('value',singer.singerId);
                 $('.song_item[data-index='+(index+1)+'] .song_id').attr('value',singer.song.songId);
                 $('.song_item[data-index='+(index+1)+'] .js-play').attr('value',singer.song.songId);
             })
         }
     })
 }
$(function () {
    $(".new_song").click(function () {
        area= $(this).attr("value");
        page=1;
        $.ajax({
            "url":"../IndexSongsServlet",
            "data":"area="+area+"&page="+page,
            "type":"GET",
            "dataType":"json",
            "success":function (data) {
                $.each(data,function (index,singer) {
                    $('.song_item[data-index='+(index+1)+'] img').attr('src',singer.song.poster);
                    $('.song_item[data-index='+(index+1)+'] .song_name').html(singer.song.songName);
                    $('.song_item[data-index='+(index+1)+'] .singer_name'). html(singer.singerName);
                    $('.song_item[data-index='+(index+1)+'] .text-ellipsis:last-child').html(singer.song.time);
                    $('.song_item[data-index='+(index+1)+'] .singer_id').attr('value',singer.singerId);
                    $('.song_item[data-index='+(index+1)+'] .song_id').attr('value',singer.song.songId);
                    $('.song_item[data-index='+(index+1)+'] .js-play').attr({'data-id':singer.song.songId,'data-type':'song'});
                })
            }
        })
    })
    $(".new_song[value=1]").click();
})
    $(function () {
        $(".new_song_bottom").click(function () {
            page= $(this).attr("value");
            //alert(page);
            $.ajax({
                "url":"/IndexSongsServlet",
                "data":"area="+area+"&page="+page,
                "type":"POST",
                "dataType":"json",
                "success":function (data) {
                    $.each(data,function (index,singer) {
                        $('.song_item[data-index='+(index+1)+'] img').attr('src',singer.song.poster);
                        $('.song_item[data-index='+(index+1)+'] .song_name').html(singer.song.songName);
                        $('.song_item[data-index='+(index+1)+'] .singer_name'). html(singer.singerName);
                        $('.song_item[data-index='+(index+1)+'] .text-ellipsis:last-child').html(singer.song.time);
                        $('.song_item[data-index='+(index+1)+'] .singer_id').attr('value',singer.singerId);
                        $('.song_item[data-index='+(index+1)+'] .song_id').attr('value',singer.song.songId);
                        $('.song_item[data-index='+(index+1)+'] .js-play').attr('value',singer.song.songId);
                    })
                }
            })
        })
    })

 $(function () {
     $(".song_slide_left").click(function () {
         if(page==2){
             page=1;
         }else{
             page=2;
         }
         //alert(page);
         $.ajax({
             "url":"/IndexSongsServlet",
             "data":"area="+area+"&page="+page,
             "type":"POST",
             "dataType":"json",
             "success":function (data) {
                 $.each(data,function (index,singer) {
                     $('.song_item[data-index='+(index+1)+'] img').attr('src',singer.song.poster);
                     $('.song_item[data-index='+(index+1)+'] .song_name').html(singer.song.songName);
                     $('.song_item[data-index='+(index+1)+'] .singer_name'). html(singer.singerName);
                     $('.song_item[data-index='+(index+1)+'] .text-ellipsis:last-child').html(singer.song.time);
                     $('.song_item[data-index='+(index+1)+'] .singer_id').attr('value',singer.singerId);
                     $('.song_item[data-index='+(index+1)+'] .song_id').attr('value',singer.song.songId);
                     $('.song_item[data-index='+(index+1)+'] .js-play').attr('value',singer.song.songId);
                 })
             }
         })
     })
 })


 $(function () {
     $(".song_slide_right").click(function () {
         if(page==1){
             page=2;
         }else{
             page=1;
         }
         //alert(page);
         $.ajax({
             "url":"/IndexSongsServlet",
             "data":"area="+area+"&page="+page,
             "type":"POST",
             "dataType":"json",
             "success":function (data) {
                 $.each(data,function (index,singer) {
                     $('.song_item[data-index='+(index+1)+'] img').attr('src',singer.song.poster);
                     $('.song_item[data-index='+(index+1)+'] .song_name').html(singer.song.songName);
                     $('.song_item[data-index='+(index+1)+'] .singer_name'). html(singer.singerName);
                     $('.song_item[data-index='+(index+1)+'] .text-ellipsis:last-child').html(singer.song.time);
                     $('.song_item[data-index='+(index+1)+'] .singer_id').attr('value',singer.singerId);
                     $('.song_item[data-index='+(index+1)+'] .song_id').attr('value',singer.song.songId);
                     $('.song_item[data-index='+(index+1)+'] .js-play').attr('value',singer.song.songId);
                 })
             }
         })
     })
 })

 $(function () {
     $('.song_item .singer_name').click(function () {
         var singer_id = $(this).next().attr("value");
         //alert(singer_id);
         window.location.href="/GetSingerDetaiServlet?opr=showDetail&singer_id="+singer_id;
     })
 })

 $(function () {
     $('.song_item .song_name').click(function () {
         var song_id = $(this).next().attr("value");
         alert(song_id)
     })
 })


 $(function () {
     $('.song_item .js-play').click(function () {
         var song_id = $(this).attr("value");
         alert(song_id)
     })
 })
